<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
%>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="copyright" content="Tencent"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>我的优惠券</title>
    <link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/mobile_coupon_public.css" />
    <link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/mobile_coupon_style.css" />
    <style>
  
    </style>
</head>
<body style="background:#f0f2f5;">
    <div class="content_tab">
        <ul class="nav">
            <li class="on">未使用</li>
            <li>使用记录</li>
            <li>已过期</li>
        </ul>
        <div class="container">
            <ul class="surrent" id="valid">
                <div style="clear:both;"></div>
            </ul>
            <ul  id="used">
            </ul>
            <ul  id="unValid">
            </ul>
        </div>
    </div>

 
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
	<script src="<%=path%>/js/marketing/public.js"></script>
	<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
	<script src="http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js"></script>
    <script type="text/javascript">
	    $('.nav li').click(function(){
	        $(this).addClass('on').siblings().removeClass();
	        var index = $(this).index();
	        $('.container ul').removeClass('surrent').eq(index).addClass('surrent');
	    });
    </script>
    
    <script type="text/javascript">
        var tenant_id="";
        var customer_id="";
        var ip="";
        var province="";
    	var city="";
    	var district="";
        
        $(function(){
        	init();
        })
        
        function init(){
        	tenant_id=getQueryString("tenant_id");
        	customer_id=getQueryString("cid");
        	ip=returnCitySN["cip"];
			province=remote_ip_info["province"];
			city=remote_ip_info["city"];
			district=remote_ip_info["district"];
			getValidCouponListByCustomerId();
			getUnValidCouponListByCustomerId();
			getUsedCouponListByCustomerId();
        }
        
        function getValidCouponListByCustomerId(){
        	var url="<%=path%>/api/coupon/validListByCid";
			$.post(url, {
				"tenant_id" : tenant_id,
				"cid" : customer_id,
			}, function(data) {
				if(data.error_code==0){
					setValidHtml(data.data);
				}else{
					
				}
			});
        }
        
        function getUnValidCouponListByCustomerId(){
        	var url="<%=path%>/api/coupon/unValidListByCid";
			$.post(url, {
				"tenant_id" : tenant_id,
				"cid" : customer_id,
			}, function(data) {
				if(data.error_code==0){
					setUnValidHtml(data.data);
				}else{
					
				}
			});
        }
        
        function getUsedCouponListByCustomerId(){
        	var url="<%=path%>/api/coupon/usedListByCid";
			$.post(url, {
				"tenant_id" : tenant_id,
				"cid" : customer_id,
			}, function(data) {
				if(data.error_code==0){
					setUsedHtml(data.data);
				}else{
					
				}
			});
        }
        
        function setValidHtml(data){
        	var html="";
        	for(var i in data){
        		html+='<a  href="<%=path%>/api/bm/ui/mobileCouponDetail?tenant_id='+tenant_id+'&code='+data[i].couponCode+'">';
                html+='<li class="blue_Bg">';
           		html+='<div class="left">';
           		if(data[i].type==1){
           			html+='<img src="<%=path%>/images/marketing/img.png" />';
           		}else{
           			html+='<b>￥</b><span>'+data[i].faceValue/100+'</span>';
           		}
      			html+='<p>满'+data[i].limitPrice/100+'元可用</p></div>';
      			html+='<div class="right">';
      			if(data[i].type==1){
      				html+='<p class="k_title"><span>物品券</span>'+data[i].couponName+'</p>';
      			}else{
      				html+='<p class="k_title"><span>优惠券</span>'+data[i].couponName+'</p>';
      			}
      			if(data[i].validityPeriodType==0){
    				if(StringEmpty(data[i].startTime)){
    					html+='<p class="k_time">'+data[i].startTime+'—'+data[i].expireTime+'</p>';
    				}else{
    					html+='<p class="k_time">'+data[i].expireTime+'</p>';
    				}
    			}else{
    				if(StringEmpty(data[i].createTime)){
    					html+='<p class="k_time">'+data[i].createTime+'—'+data[i].expireTime+'</p>';
    				}else{
    					html+='<p class="k_time">'+data[i].expireTime+'</p>';
    				}
    				
    			}
      			html+='<p>点击优惠券查看详细信息</p></div></li></a>';
        	}
        	$('#valid').html(html);
        }
        
        function setUnValidHtml(data){
        	var html="";
        	for(var i in data){
        		html+='<a  href="<%=path%>/api/bm/ui/mobileCouponDetail?tenant_id='+tenant_id+'&code='+data[i].couponCode+'">';
                html+='<li class="gray_Bg">';
           		html+='<div class="left">';
           		if(data[i].type==1){
           			html+='<img src="<%=path%>/images/marketing/img.png" />';
           		}else{
           			html+='<b>￥</b><span>'+data[i].faceValue/100+'</span>';
           		}
      			html+='<p>满'+data[i].limitPrice/100+'元可用</p></div>';
      			html+='<div class="right">';
      			if(data[i].type==1){
      				html+='<p class="k_title"><span>物品券</span>'+data[i].couponName+'</p>';
      			}else{
      				html+='<p class="k_title"><span>优惠券</span>'+data[i].couponName+'</p>';
      			}
      			if(data[i].validityPeriodType==0){
    				if(StringEmpty(data[i].startTime)){
    					html+='<p class="k_time">'+data[i].startTime+'—'+data[i].expireTime+'</p>';
    				}else{
    					html+='<p class="k_time">'+data[i].expireTime+'</p>';
    				}
    			}else{
    				if(StringEmpty(data[i].createTime)){
    					html+='<p class="k_time">'+data[i].createTime+'—'+data[i].expireTime+'</p>';
    				}else{
    					html+='<p class="k_time">'+data[i].expireTime+'</p>';
    				}
    				
    			}
      			html+='<p>点击优惠券查看详细信息</p></div></li></a>';
        	}
        	$('#unValid').html(html);
        }
        
        function setUsedHtml(data){
        	var html="";
        	for(var i in data){
        		html+='<a  href="<%=path%>/api/bm/ui/mobileCouponDetail?tenant_id='+tenant_id+'&code='+data[i].couponCode+'">';
                html+='<li class="gray_Bg">';
           		html+='<div class="left">';
           		if(data[i].type==1){
           			html+='<img src="<%=path%>/images/marketing/img.png" />';
           		}else{
           			html+='<b>￥</b><span>'+data[i].faceValue/100+'</span>';
           		}
      			html+='<p>满'+data[i].limitPrice/100+'元可用</p></div>';
      			html+='<div class="right">';
      			if(data[i].type==1){
      				html+='<p class="k_title"><span>物品券</span>'+data[i].couponName+'</p>';
      			}else{
      				html+='<p class="k_title"><span>优惠券</span>'+data[i].couponName+'</p>';
      			}
      			if(data[i].validityPeriodType==0){
    				if(StringEmpty(data[i].startTime)){
    					html+='<p class="k_time">'+data[i].startTime+'—'+data[i].expireTime+'</p>';
    				}else{
    					html+='<p class="k_time">'+data[i].expireTime+'</p>';
    				}
    			}else{
    				if(StringEmpty(data[i].createTime)){
    					html+='<p class="k_time">'+data[i].createTime+'—'+data[i].expireTime+'</p>';
    				}else{
    					html+='<p class="k_time">'+data[i].expireTime+'</p>';
    				}
    				
    			}
      			html+='<p>点击优惠券查看详细信息</p></div>';
      			html+='<img src="<%=path%>/images/marketing/past_img.png" /></li></a>';
        	}
        	$('#used').html(html);
        }
        
        
        $(window).load(function() { 
			 createBrowse();
		});
        function createBrowse(){
        	var url="<%=path%>/social/coupon_batch/createCouponBrowse";
			$.post(url, {
				"tenant_id" : tenant_id,
				"customerId" : customer_id,
				"province":province,
				"city":city,
				"district":district,
				"ip":ip,
				"couponBatchId":couponBatchId,
			}, function(data) {
			});
        }
        
       
    
    </script>
    
</body>
</html>